<style lang="scss" scoped>
@import '../../styles/common/loading.less';
.container{
    border: none !important;
    margin-top: 4px;
}
.el-col-offset-1 {
    margin-left: 0%;
}
.button_a {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
}
.col_a {
    margin-left: 2%;
}
.el-card {
    height: 200px;
}
.el-button--primary {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
}
</style>
<template>
    <div  class="common-background-color"
          v-loading="loading"
          element-loading-text="loading......"
          element-loading-spinner="el-icon-loading"
          element-loading-background="rgba(0, 0, 0, 0.8)">
        <div style="width:98%;height:100%;margin: 6px 12px;">
            <el-collapse v-model="activeNames" v-if="this.item===2" >
                <el-collapse-item title="账户信息"  name="1">
                    <el-form ref="form" :model="form" class="info-submit-form">
                        <el-row type="flex" >
                            <el-col :span="8">
                                <el-form-item label="归属机构" prop="comName" >
                                    <el-input disabled   v-model="form.comName" placeholder="请输入"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="账户名称" prop="payeeName" >
                                    <el-input disabled   v-model="form.payeeName" placeholder="请输入"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="证件类型" prop="identifyType"  >
                                    <el-select disabled    placeholder="请选择" v-model="form.identifyType">
                                        <el-option value="" label="请选择"></el-option>
                                        <el-option
                                          v-for="item in IdentifyType"
                                          :key="item.codeCode"
                                          :label="item.codeCName"
                                          :value="item.codeCode">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="8" >
                                <el-form-item label="证件号码" prop="identifyNo"  >
                                    <el-input disabled placeholder="请输入" v-model="form.identifyNo"  ></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="收款银行大类" prop="bankBroad" >
                                  <el-select disabled  v-model="form.bankBroad"  placeholder="请选择">
                                    <el-option
                                      v-for="item in BankBigType"
                                      :key="item.codeCode"
                                      :label="item.codeCName"
                                      :value="item.codeCode">
                                    </el-option>
                                  </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="开户行省" prop="bankProvince" >
                                    <el-input  disabled   v-model="form.bankProvince"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="8" >
                                <el-form-item label="开户行市" prop="bankCity" >
                                    <el-input  disabled   v-model="form.bankCity"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="开户行县" prop="bankDistrict" >
                                    <el-input  disabled   v-model="form.bankDistrictName"></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="开户银行" prop="bankName" >
                                    <el-input  disabled   v-model="form.bankName"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="8" >
                                <el-form-item label="银行地址" prop="bankAddress">
                                    <el-input disabled v-model="form.bankAddress" placeholder="请输入"  ></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="对公对私" prop="bankToPubPri">
                                    <el-select disabled  placeholder="请选择" v-model="form.bankToPubPri" >
                                        <el-option
                                          v-for="item in pubPriList"
                                          :key="item.codeCode"
                                          :label="item.codeCName"
                                          :value="item.codeCode">
                                        </el-option>
                                    </el-select>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="账号" prop="bankNo">
                                    <el-input  disabled   v-model="form.bankNo"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="8" >
                                <el-form-item label="联系电话" prop="phone"  >
                                    <el-input  disabled   v-model="form.phone"></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>    
                    </el-form>
                </el-collapse-item>
            </el-collapse>
        </div>
        <div>
            <template>
                <div slot="footer" style="text-align: center;height: 60px;line-height: 30px" class="dialog-footer">
                    <el-button type="primary" v-if="this.item===2" @click="closePage">关闭</el-button>
                </div>
            </template>
        </div>
    </div>
</template>

<script>
import * as api from '@/api/baseDate'
export default {
    name: 'accountInfoSee',
    data() {
        return {
            loading:false,
            pubPriList:[ //
              {
                codeCode:"1",
                codeCName:"对公",
              },
              {
                codeCode:"2",
                codeCName:"对私",
              }
            ],
            activeNames: ['1','2'],
            form: {
                bankBroad:'',
                bankName:'',
                bankCode:'',
                bankProvince:'',
                bankCity:'',
                bankDistrict:'',
                bankDistrictName:'',
                bankAddress:'',
            },
            item:0,
            BankBigType:[],
            IdentifyType:[],
            isAble: true,
            isAble02: true,
        }
    },
    created() {
        this.queryBankBroadList(); // 银行大类
        this.queryIdentifyTypeList(); // 证件类型
        this.form=JSON.parse(this.$route.query.accountInfoDemo)
        this.item=JSON.parse(this.$route.query.item)
    },
    methods: {
        // 证件类型
        queryIdentifyTypeList(){
          var data={
            "codeType": "IdentifyType"
          }
          api.MedType(data
          ).then(res => {
            this.IdentifyType=res.data
          })
        },
        // 收款银行大类
        queryBankBroadList(){
            api.queryBankClassList('').then(res=> {
                this.BankBigType = res.data
            })
        }, 
        // 关闭页面
        closePage(){
            this.closePageTo(this.$store,this.$route,this.$router,'accountInfo');
        },
    }
}
</script>